<template>
  <div>
    <Nav></Nav>
    <div>
      <el-container>
        <el-aside width="200px">
          <el-menu default-active="1">
            <template v-for="item in nodeNameDatas">
              <el-menu-item :index="item.id" :key="item.id" @click="getNodeDatas(item.classification)">
                <span slot="title">{{item.name}}</span>
              </el-menu-item>
            </template>
          </el-menu>
        </el-aside>
        <el-main>
          <div style="float:right">
            <el-button type="primary" @click="add" :disabled="nodeChoose.length > 0 ? false : true">添加</el-button>
          </div>
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
            <el-table-column prop="nodeName" label="节点名称" width="180" align="center"></el-table-column>
            <el-table-column prop="authorName" label="节点人员" align="center"></el-table-column>
            <el-table-column label="操作" align="center" width="250px">
              <template slot-scope="scope">
                <el-button type="primary" size="medium" @click="cmdEdit(scope.row)">修改</el-button>
                <el-button type="danger" size="medium" @click="cmdDelete(scope.row.orunid)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-main>
      </el-container>
    </div>
    <add-dig :show="showAddDialog" @closeDlg="closeAddDialog" :node="node"></add-dig>
    <edit-dig :show="showEditDialog" @closeDlg="closeEditDialog" :node="node" :content="content"></edit-dig>
  </div>
</template>
<script>
import { getImplmentNodes, getAllConfigRecords, embodimentDeleteOne } from '@/api/api'
import nav from '../../../components/navigation'
import swal from 'sweetalert'
import _ from 'underscore'
import AddDig from './add'
import EditDig from './edit'
export default {
  components: {
    Nav: nav,
    'add-dig': AddDig,
    'edit-dig': EditDig,
  },
  data () {
    return {
      nodeNameDatas: [
        { id: '1', name: '实施方案系统节点表', classification: 'config1' },
        { id: '2', name: '设计方案系统节点表', classification: 'config2' },
        { id: '3', name: '招投标流程节点表', classification: 'config3' },
      ],
      tableData: [],
      nodeChoose: [],
      showAddDialog: false,
      showEditDialog: false,
      node: 'config1',
      content: {}
    }
  },
  watch: {
    node(newV, oldV) {
      this.tableData = []
    }
  },
  mounted () {
    this.getDataSelect()
    this.getNodeDatas('config1')  // 首页默认加载实施方案系统节点表
  },
  methods: {
    // 获取下拉列表所有节点名称，用于判断是否还能继续添加
    getDataSelect () {
      let params = {
        orunid: '40288474757281280175728157320000'
      }
      getImplmentNodes(params).then(res => {
        if (res.code == 200) {
          this.nodeChoose = res.data
        } else {
          swal('错误', res.message || '网络连接错误', 'warning')
        }
      }).catch((err) => {
        swal('错误', '网络连接错误', 'error')
      })
    },
    // 获取实施方案所有节点数据
    getNodeDatas (val) {
      this.node = val
      let params = {
        classification: val
      }
      getAllConfigRecords(params).then(res => {
        // console.log(res)
        if (res.code == 200) {
          this.tableData = res.data
        } else {
          swal('错误', res.message || '网络连接错误', 'warning')
        }
      }).catch((err) => {
        swal('错误', '网络连接错误', 'error')
      })
    },
    add () {
      this.showAddDialog = true
    },
    closeAddDialog () {
      this.showAddDialog = false
      this.getDataSelect()
      this.getNodeDatas(this.node)
    },
    closeEditDialog() {
       this.showEditDialog = false
       this.getNodeDatas(this.node)
    },
    // 修改
    cmdEdit(row) {
      this.showEditDialog = true
      this.content = row
    },
    cmdDelete (orunid) {
      let msg = '将删除该节点所有数据，是否确认删除!'
      this.confirm(msg, () => {
        let params = {
          orunid: orunid
        }
        embodimentDeleteOne(params).then(res => {
          if (res.code == 200) {
            this.alertok('删除成功', () => {
              this.getDataSelect()
              this.getNodeDatas()
            })
          } else {
            swal('错误', res.message || '网络连接错误', 'warning')
          }
        }).catch((err) => {
          swal('错误', '网络连接错误', 'error')
        })
      })
    }
  }
}
</script>
<style lang="less" scoped>
.table1 {
  width: 80%;
  margin: auto;
}
.table2 {
  width: 80%;
  margin: 45px auto;
}
.titleNode {
  text-align: center;
}
</style>